<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('挂起流程定义')" />
    <th:block th:include="include :: datetimepicker-css" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal" id="model-add">
            <div class="form-group">
                <label class="col-sm-3 col-sm-offset-2 control-label">挂起关联流程实例：</label>
                <div class="col-sm-3">
                    <label class="toggle-switch switch-solid">
                        <input type="checkbox" id="status" checked="checked"> <span></span>
                    </label>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 col-sm-offset-2 control-label">定时挂起：</label>
                <div class="col-sm-3">
                    <label class="toggle-switch switch-solid" for="cron">
                        <input type="checkbox" id="cron"> <span></span>
                    </label>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 col-sm-offset-2 control-label">挂起时间：</label>
                <div class="col-sm-4">
                    <div class="input-group date"> <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                        <input name="date" id="date" type="text" class="form-control">
                        <input type="hidden" name="pdid" id="pdid"  th:value="${pdid}" />
                    </div>
                </div>
            </div>

    </form>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: datetimepicker-js" />
<script th:inline="javascript">
    function submitHandler() {
        var pdid = $("#pdid").val();
        var flag = $("#status").prop("checked");
        var date = $("#date").val();
        $.operate.get("/flow/manage/suspendProcessDefinition?pdid="+pdid+"&flag="+flag+"&date="+date, function (){
            $.modal.alert("挂起成功");
            $.modal.close();
            $.table.refresh();
        });
    }

    $("input[name='date']").datetimepicker({
        format: "yyyy-mm-dd hh:ii:ss",
        autoclose: true
    });

    $(document).ready(function(){
        if ($("#cron").prop("checked") == false) {
            $("input[name='date']").attr("disabled","disabled");
        }

        $("#cron").click(function (){
            if ($("#cron").prop("checked") == true) {
                $("input[name='date']").removeAttr("disabled");
            } else {
                $("input[name='date']").attr("disabled","disabled");
                $("#date").val("");
            }
        });
    });
</script>
</body>
</html>